import 'package:animal/constant/color.dart';
import 'package:animal/constant/font.dart';
import 'package:animal/item/message_history_item.dart';
import 'package:animal/socket/type_model.dart';
import 'package:animal/ui/message/controller/message_detail_controller.dart';
import 'package:animal/utils/screen_util.dart';
import 'package:animal/widgets/appbar_widget.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:getwidget/getwidget.dart';

///消息聊天界面
class MessageDetailPage extends StatelessWidget {
  final UserModel friendModel;

  MessageDetailPage({
    Key? key,
    required this.friendModel,
  }) : super(key: key);
  final MessageDetailController controller = Get.put(MessageDetailController());

  @override
  Widget build(BuildContext context) {
    controller.friendModel = friendModel;
    return Scaffold(
      backgroundColor: KColorConstant.appBgColor,
      // resizeToAvoidBottomInset: false,
      appBar: AppBarWidget.defaultAppBar(title: Text(friendModel.nickName!), elevation: 1, centerTitle: false, backgroundColor: Colors.white),
      body: Column(
        children: [
          Expanded(
            child: Obx(() => Align(
                  alignment: Alignment.topCenter,
                  child: ListView.builder(
                      controller: controller.scrollController,
                      itemCount: controller.data.length,
                      padding: EdgeInsets.only(bottom: ScreenUtil().L(30)),
                      physics: const ClampingScrollPhysics(),
                      reverse: true,
                      shrinkWrap: true,
                      itemBuilder: (BuildContext context, int index) {
                        return InkWell(
                          child: Obx(() => Center(child: MessageHistoryItem(model: controller.data[index],))),
                          // onLongPress: () {
                          //   viewModel.popupBtn(data: viewModel.historyMessageList[index]);
                          // },
                        );
                      }),
                )),
          ),
          SizedBox(
            height: ScreenUtil().L(50),
            child: Row(
              children: [
                GFIconButton(
                  icon: const Icon(Icons.multitrack_audio),
                  onPressed: () {},
                  type: GFButtonType.transparent,
                ),
                Expanded(
                    child: Container(
                      padding: EdgeInsets.symmetric(horizontal: ScreenUtil().L(15)),
                  decoration: BoxDecoration(
                    color: KColorConstant.lineE5E5E5,
                    borderRadius: BorderRadius.circular(ScreenUtil().L(5)),
                  ),
                  child: TextField(
                    controller: controller.textEditingController,
                    decoration: const InputDecoration(border: InputBorder.none),
                    textInputAction: TextInputAction.send,
                    onEditingComplete: ()=>controller.sendTextMessage(),
                  ),
                )),
                GFIconButton(
                  icon: const Icon(Icons.face),
                  onPressed: () {},
                  type: GFButtonType.transparent,
                ),
                GFIconButton(
                  icon: const Icon(Icons.add_circle_outline),
                  onPressed: () =>controller.imageMessage(),
                  type: GFButtonType.transparent,
                ),
              ],
            ),
          )
        ],
      ),
    );
  }

  /// 构建消息视图
  // Widget _buildMsg(MessageEntity entity) {
  //   if (entity.own) {
  //     return Container(
  //       margin: EdgeInsets.all(ScreenUtil().L(10)),
  //       child: Row(
  //         mainAxisAlignment: MainAxisAlignment.end,
  //         crossAxisAlignment: CrossAxisAlignment.start,
  //         children: <Widget>[
  //           Column(
  //             crossAxisAlignment: CrossAxisAlignment.end,
  //             children: <Widget>[
  //               Container(
  //                 margin: EdgeInsets.only(top: ScreenUtil().L(5)),
  //                 padding: EdgeInsets.all(ScreenUtil().L(10)),
  //                 decoration: BoxDecoration(
  //                   color: Colors.lightGreen,
  //                   borderRadius: BorderRadius.circular(ScreenUtil().L(10)),
  //                 ),
  //                 constraints: BoxConstraints(
  //                   maxWidth: ScreenUtil().L(200),
  //                 ),
  //                 child: Text(
  //                   entity.msg,
  //                   overflow: TextOverflow.clip,
  //                   style: KFontConstant.myTextStyle(size: 16),
  //                 ),
  //               )
  //             ],
  //           ),
  //           Card(
  //             margin: EdgeInsets.only(left: ScreenUtil().L(15)),
  //             clipBehavior: Clip.hardEdge,
  //             shape: const RoundedRectangleBorder(
  //               borderRadius: BorderRadius.all(Radius.circular(20.0)),
  //             ),
  //             elevation: 0.0,
  //             child: SizedBox(
  //               height: 40.0,
  //               width: 40.0,
  //               child: Image.asset('images/wechat.png'),
  //             ),
  //           ),
  //         ],
  //       ),
  //     );
  //   } else {
  //     return Container(
  //       margin: EdgeInsets.all(ScreenUtil().L(10)),
  //       child: Row(
  //         mainAxisAlignment: MainAxisAlignment.start,
  //         crossAxisAlignment: CrossAxisAlignment.start,
  //         children: <Widget>[
  //           Card(
  //             margin: const EdgeInsets.only(
  //               right: 10.0,
  //             ),
  //             clipBehavior: Clip.hardEdge,
  //             shape: const RoundedRectangleBorder(
  //               borderRadius: BorderRadius.all(Radius.circular(20.0)),
  //             ),
  //             elevation: 0.0,
  //             child: SizedBox(
  //               height: 40.0,
  //               width: 40.0,
  //               child: Image.asset('images/home1.png'),
  //             ),
  //           ),
  //           Column(
  //             crossAxisAlignment: CrossAxisAlignment.start,
  //             children: <Widget>[
  //               const Text(
  //                 'KnoYo',
  //                 style: TextStyle(
  //                   color: Colors.grey,
  //                   fontSize: 13.0,
  //                 ),
  //               ),
  //               Container(
  //                 margin: const EdgeInsets.only(
  //                   top: 5.0,
  //                 ),
  //                 padding: const EdgeInsets.all(10.0),
  //                 decoration: const BoxDecoration(
  //                   color: Colors.white,
  //                   borderRadius: BorderRadius.all(Radius.circular(
  //                     4.0,
  //                   )),
  //                 ),
  //                 constraints: const BoxConstraints(
  //                   maxWidth: 200.0,
  //                 ),
  //                 child: Text(
  //                   entity.msg,
  //                   overflow: TextOverflow.clip,
  //                   style: const TextStyle(
  //                     fontSize: 16.0,
  //                   ),
  //                 ),
  //               )
  //             ],
  //           ),
  //         ],
  //       ),
  //     );
  //   }
  // }

  Widget emojiWidget() {
    return new GestureDetector(
      child: new SizedBox(
        height: _emojiState ? keyboardHeight : 0,
        child: GridView.builder(
          gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
              crossAxisCount: 7, crossAxisSpacing: 10.0, mainAxisSpacing: 10.0),
          scrollDirection: Axis.horizontal,
          itemBuilder: (context, index) {
            return GestureDetector(
              child: Image.asset(EmojiUitl.instance.emojiMap["[${index + 1}]"]),
              behavior: HitTestBehavior.translucent,
              onTap: () {
                insertText("[${index + 1}]");
              },
            );
          },
          itemCount: EmojiUitl.instance.emojiMap.length,
          padding: EdgeInsets.all(5.0),
        ),
      ),
      onTap: () {},
    );
  }
}
